// UI设计规范

// 颜色
$MainColor: #F96A00; // 主色
$TitleColour: #07043f; // 标题色
$TextColour: #1c1c4e; // 正文
$AuxiliaryColourDark: #63659e; // 辅助色深
$SecondaryColourMedium: #adaee1; // 辅助色浅
$AuxiliaryColourLight: #dadbf4; // 辅助色浅
$backgroundColour: #ebf3f5; // 背景色
$menuBackgroundColor: #333C39; // 菜单栏背景色
$hoverColour: #fbfbfb; // 全局悬停色

// 功能色使用
$LinkColor: #F96A00;
$SuccessColor: #53c41a;
$WarningColor: #f9ad14;
$ErrorColor: #ff4d4f;

// 字号使用
$ImportantNotesSize: 24px;
$TitleSize: 20px;
$SubtitleSize: 18px;
$SubheadingSize: 16px;
$FontSize: 14px;
$SubFontSize: 12px;

// svg图标大小
$FirstSvg: 24px;
$SecondSvg: 20px;
$ThirdSvg: 18px;
$FourthSvg: 16px;
$FifthSvg: 14px;
$SixthSvg: 12px;

// 间距
$FirstSpacing: 50px;
$SecondSpacing: 30px;
$ThirdSpacing: 24px;
$FourthSpacing: 16px;
$FifthSpacing: 12px;
$SixthSpacing: 10px;

// sidebar
$menuText: #fff;
$menuActiveText: #F96A00;

// 有二级菜单情况，打击过后文字颜色
$subMenuActiveText: #9fdfcb; //https://github.com/ElemeFE/element/issues/12951
$menuBg: #333C39; // 侧边栏背景颜色
$menuHover: linear-gradient(270deg, #333c39, #009968 40%); // 侧边栏悬浮颜色
$menuActiveBackgroundColor: linear-gradient(270deg, #333c39, #009968 40%); // 侧边栏目选中颜色
$subMenuBg: $menuBackgroundColor; // 
$subMenuHover: $menuBackgroundColor;
$sideBarWidth: 250px;
$appHeadHeight: 70px;
$minWidth: 1200px;


// table分也栏颜色
$tablePageLiColor: #FFF3E6; // 分页标签颜色
$tablePageLiActiveColor: $MainColor; // 分页标签选中颜色

// the :export directive is the magic sauce for webpack
// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
:export {
  menuText: $menuText;
  menuActiveText: $menuActiveText;
  subMenuActiveText: $subMenuActiveText;
  menuActiveBackgroundColor: $menuActiveBackgroundColor;
  menuBg: $menuBg;
  menuHover: $menuHover;
  subMenuBg: $subMenuBg;
  subMenuHover: $subMenuHover;
  sideBarWidth: $sideBarWidth;
  appHeadHeight: $appHeadHeight;
  minWidth: $minWidth;
  hoverColour: $hoverColour;

  // 颜色
  MainColor: $MainColor; // 主色
  TitleColour: $TitleColour; // 标题色
  TextColour: $TextColour; // 正文
  AuxiliaryColourDark: $AuxiliaryColourDark; // 辅助色深
  SecondaryColourMedium: $SecondaryColourMedium; // 辅助色浅
  AuxiliaryColourLight: $AuxiliaryColourLight; // 辅助色浅
  backgroundColour: $backgroundColour; // 背景色

  // 功能色使用
  LinkColor: $LinkColor;
  SuccessColor: $SuccessColor;
  WarningColor: $WarningColor;
  ErrorColor: $WarningColor;

  // 字号使用
  ImportantNotesSize: $ImportantNotesSize;
  TitleSize: $TitleSize;
  SubtitleSize: $SubtitleSize;
  SubheadingSize: $SubheadingSize;
  FontSize: $FontSize;
  SubFontSize: $SubFontSize;

  // 间距
  FirstSpacing: $FirstSpacing;
  SecondSpacing: $SecondSpacing;
  ThirdSpacing: $ThirdSpacing;
  FourthSpacing: $FourthSpacing;
  FifthSpacing: $FifthSpacing;
  SixthSpacing: $SixthSpacing;

  // SVG图标大小
  FirstSvg: $FirstSvg;
  SecondSvg: $SecondSvg;
  ThirdSvg: $ThirdSvg;
  FourthSvg: $FourthSvg;
  FifthSvg: $FifthSvg;
  SixthSvg: $SixthSvg;

  // 分页样式
  tablePageLiColor: $tablePageLiColor; // 分页标签颜色
  tablePageLiActiveColor: $tablePageLiActiveColor; // 分页标签选中颜色

}